<template>
	<view class="page tab-page">
		<!-- <nav-header :show-left="false" :show-right="false" title="发现"></nav-header> -->
		<up-navbar :auto-back="false" title-width="200" placeholder bgColor="transparent" :fixed="false">
			<template v-slot:left>
				<text class="title">发现</text>
			</template>
		</up-navbar>

		<!-- 		<view class="find">
			<list-contacts type="function" status="contact" :List="findList">
			</list-contacts>
		</view> -->
		<view class="friend-txl">
			<view v-for="(item,index) in findList" :key="item.path">
				<view class="txl" @click="GoMoments(item.path)" v-if="funcMap[item.name]">
					<view class="txl-left">
						<svg-icon :icon=item.icon :width="60"></svg-icon>
						<text>{{item.message}}</text>
					</view>
					<view class="txl-right">
						<!-- <uni-icons type="right" size="24"></uni-icons> -->
						<svg-icon icon="arrowRight" :width="32"></svg-icon>
					</view>
				</view>
			</view>
			<!-- 			<view class="txl" @click="GoMoments">
				<view class="txl-left">
					<svg-icon icon="Variant7" :width="60"></svg-icon>
					<text>好友圈</text>
				</view>
				<view class="txl-right">
					<uni-icons type="right" size="24"></uni-icons>
				</view>
			</view> -->

			<!-- <view class="txl" style="margin-top: 20rpx;" @click="goUpdates">
				<view class="txl-left">
					<svg-icon icon="fjdt" :width="60"></svg-icon>
					<text>附近动态</text>
				</view>
				<view class="txl-right">
					<uni-icons type="right" size="24"></uni-icons>
				</view>
			</view>
			<view class="txl" @click="goPeople">
				<view class="txl-left">
					<svg-icon icon="location" :width="60"></svg-icon>
					<text>附近的人</text>
				</view>
				<view class="txl-right">
					<uni-icons type="right" size="24"></uni-icons>
				</view>
			</view>
			<view class="txl" style="margin-top: 20rpx;" @click="goSquare">
				<view class="txl-left">
					<svg-icon icon="gc" :width="60"></svg-icon>
					<text>资源广场</text>
				</view>
				<view class="txl-right">
					<uni-icons type="right" size="24"></uni-icons>
				</view>
			</view>-->
		</view>

		<!-- #ifdef APP-PLUS -->
		<view>
			<custom-tabbar :selected="3"></custom-tabbar>
		</view>
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				ShowHidden: false,
				findList: [{
						icon: "Variant6",
						message: "友商圈",
						path: "/pageSubOne/business-moments/mine-business-moments",
						name: "ysq"
					},
					{
						icon: "Variant7",
						message: "好友圈",
						path: "/pageSubOne/moments/mine-moments",
						name: "hyq"
					},
					// {
					// 	icon: "fjdt",
					// 	message: "附近动态",
					// 	path: "/pageSubOne/find/nearby-updates"
					// }, {
					// 	icon: "location",
					// 	message: "附近的人",
					// 	path: "/pageSubOne/find/people-nearby"
					// },
					// {
					// 	icon: "gc",
					// 	message: "资源广场",
					// 	path: "/pageSubOne/find/resource-square"
					// }
				],
			}
		},
		computed: {
			funcMap() {
				return this.enableStore.funcMap
			}
		},
		methods: {
			headleClose(data) {
				this.ShowHidden = data
				this.ShowHidden = !this.ShowHidden
			},
			headleHide() {
				this.ShowHidden = !this.ShowHidden
				// console.log(this.ShowHidden)
			},
			GoMoments(path) {
				uni.navigateTo({
					url: path
				})
			},
			GoBsMoments() {
				uni.navigateTo({
					url: "/pageSubOne/business-moments/mine-business-moments"
				})
			},
			goUpdates() {
				uni.navigateTo({
					url: "/pageSubOne/find/nearby-updates"
				})
			},
			goPeople() {
				uni.navigateTo({
					url: "/pageSubOne/find/people-nearby"
				})
			},
			goSquare() {
				uni.navigateTo({
					url: "/pageSubOne/find/resource-square"
				})
			}
		},
		onLoad() {
			// this.displayFind()
		}
	}
</script>

<style lang="scss" scoped>
	.tab-page {
		position: relative;
		display: flex;
		flex-direction: column;

		.title {
			font-size: 40rpx;
			font-weight: bold;
			padding: 0 3px;
		}

		.find {
			padding: 16rpx 0;
			margin-top: 16rpx;
		}

		.mask {
			// background-color: #000;
			// opacity: 0.3;
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1
		}

		.nav-bar {
			padding: 10rpx 20rpx;
			display: flex;
			align-items: center;
			background-color: white;
			justify-content: flex-end;
			text-align: center;
			height: 110rpx;
		}

		.nav-more {
			background-color: #fff;
			cursor: pointer;
			z-index: 2
		}

		.friend-txl {
			width: 100%;

			.txl {
				padding: 20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				// background-color: white;

				.txl-left {
					display: flex;
					align-items: center;

					text {
						margin-left: 40rpx;
					}

					.txl-img {
						width: 60rpx;
						height: 60rpx;
					}
				}
			}
		}
	}
</style>